<template>
    <div class="body">
        <div style="width: 100%; background-color: white">
            <div class="advertisement"></div>
        </div>
        <div class="all">
            <div class="cart-filter">
                <ul>
                    <li>全部商品</li>
                    <li>特价商品</li>
                    <li>活动商品</li>
                </ul>
                <div class="wrap-line"></div>
            </div>
            <div class="commodity">
                <div>
                    <ul>
                        <li class="checkbox"><label for=""><input type="checkbox"></label></li>
                        <li class="introduce">
                            <a href="#"><img src="http://127.0.0.1:3002/images/cart/1.jpg" alt=""></a>
                            <div>官方授权  《我的青春恋爱物语果然有问题》原版小说</div>
                        <div data-v-5abf99a0="" class="unit_price"><ruby data-v-5abf99a0="">
                            ￥23.80
                            <rp data-v-5abf99a0=""></rp> <rt data-v-5abf99a0="" class="logo" style="text-decoration: line-through; color: gray;">￥39.80</rt> <rp data-v-5abf99a0=""></rp></ruby></div>


                        <div class="amount">
                            <span class="goods_num">
                                <input data-v-376851e1="" type="text" value="0" class="num">
                                <span data-v-376851e1="" class="add">+</span>
                                <span data-v-376851e1="" class="reduce">-</span>
                            </span></div>
                        </li>
                        <li class="blank"></li>
                        <li class="temporary"></li>
                        <li class="unit_price">
                            <ruby>
                                ￥23.80
                                <rp></rp>
                                <rt class="logo" style="text-decoration:line-through;color: gray">￥39.80</rt>
                                <rp></rp>
                            </ruby>
                        </li>
                        <li class="amount">
                            <span class="goods_num">
                                <input data-v-376851e1="" type="text" value="0" class="num">
                                <span data-v-376851e1="" class="add">+</span>
                                <span data-v-376851e1="" class="reduce">-</span>
                            </span></li>
                        <li class="money"><em>￥23.80</em></li>
                        <li class="operate">
                            <a href="#">加入收藏夹</a>
                            <a href="#">删除</a>
                        </li>
                    </ul>
                </div>
            </div>

            <div class="commodity">
                <div>
                    <ul>
                        <li class="checkbox"><label for=""><input type="checkbox"></label></li>
                        <li class="introduce">
                            <a href="#"><img src="http://127.0.0.1:3002/images/cart/1.jpg" alt=""></a>
                            <div>官方授权  《我的青春恋爱物语果然有问题》原版小说</div>
                            <div data-v-5abf99a0="" class="unit_price"><ruby data-v-5abf99a0="">
                                ￥23.80
                                <rp data-v-5abf99a0=""></rp> <rt data-v-5abf99a0="" class="logo" style="text-decoration: line-through; color: gray;">￥39.80</rt> <rp data-v-5abf99a0=""></rp></ruby></div>


                            <div class="amount">
                            <span class="goods_num">
                                <input data-v-376851e1="" type="text" value="0" class="num">
                                <span data-v-376851e1="" class="add">+</span>
                                <span data-v-376851e1="" class="reduce">-</span>
                            </span></div>
                        </li>
                        <li class="blank"></li>
                        <li class="temporary"></li>
                        <li class="unit_price">
                            <ruby>
                                ￥23.80
                                <rp></rp>
                                <rt class="logo" style="text-decoration:line-through;color: gray">￥39.80</rt>
                                <rp></rp>
                            </ruby>
                        </li>
                        <li class="amount">
                            <span class="goods_num">
                                <input data-v-376851e1="" type="text" value="0" class="num">
                                <span data-v-376851e1="" class="add">+</span>
                                <span data-v-376851e1="" class="reduce">-</span>
                            </span></li>
                        <li class="money"><em>￥23.80</em></li>
                        <li class="operate">
                            <a href="#">加入收藏夹</a>
                            <a href="#">删除</a>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="commodity">
                <div>
                    <ul>
                        <li class="checkbox"><label for=""><input type="checkbox"></label></li>
                        <li class="introduce">
                            <a href="#"><img src="http://127.0.0.1:3002/images/cart/1.jpg" alt=""></a>
                            <div>官方授权  《我的青春恋爱物语果然有问题》原版小说</div>
                            <div data-v-5abf99a0="" class="unit_price"><ruby data-v-5abf99a0="">
                                ￥23.80
                                <rp data-v-5abf99a0=""></rp> <rt data-v-5abf99a0="" class="logo" style="text-decoration: line-through; color: gray;">￥39.80</rt> <rp data-v-5abf99a0=""></rp></ruby></div>


                            <div class="amount">
                            <span class="goods_num">
                                <input data-v-376851e1="" type="text" value="0" class="num">
                                <span data-v-376851e1="" class="add">+</span>
                                <span data-v-376851e1="" class="reduce">-</span>
                            </span></div>
                        </li>
                        <li class="blank"></li>
                        <li class="temporary"></li>
                        <li class="unit_price">
                            <ruby>
                                ￥23.80
                                <rp></rp>
                                <rt class="logo" style="text-decoration:line-through;color: gray">￥39.80</rt>
                                <rp></rp>
                            </ruby>
                        </li>
                        <li class="amount">
                            <span class="goods_num">
                                <input data-v-376851e1="" type="text" value="0" class="num">
                                <span data-v-376851e1="" class="add">+</span>
                                <span data-v-376851e1="" class="reduce">-</span>
                            </span></li>
                        <li class="money"><em>￥23.80</em></li>
                        <li class="operate">
                            <a href="#">加入收藏夹</a>
                            <a href="#">删除</a>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="commodity">
                <div>
                    <ul>
                        <li class="checkbox"><label for=""><input type="checkbox"></label></li>
                        <li class="introduce">
                            <a href="#"><img src="http://127.0.0.1:3002/images/cart/1.jpg" alt=""></a>
                            <div>官方授权  《我的青春恋爱物语果然有问题》原版小说</div>
                            <div data-v-5abf99a0="" class="unit_price"><ruby data-v-5abf99a0="">
                                ￥23.80
                                <rp data-v-5abf99a0=""></rp> <rt data-v-5abf99a0="" class="logo" style="text-decoration: line-through; color: gray;">￥39.80</rt> <rp data-v-5abf99a0=""></rp></ruby></div>


                            <div class="amount">
                            <span class="goods_num">
                                <input data-v-376851e1="" type="text" value="0" class="num">
                                <span data-v-376851e1="" class="add">+</span>
                                <span data-v-376851e1="" class="reduce">-</span>
                            </span></div>
                        </li>
                        <li class="blank"></li>
                        <li class="temporary"></li>
                        <li class="unit_price">
                            <ruby>
                                ￥23.80
                                <rp></rp>
                                <rt class="logo" style="text-decoration:line-through;color: gray">￥39.80</rt>
                                <rp></rp>
                            </ruby>
                        </li>
                        <li class="amount">
                            <span class="goods_num">
                                <input data-v-376851e1="" type="text" value="0" class="num">
                                <span data-v-376851e1="" class="add">+</span>
                                <span data-v-376851e1="" class="reduce">-</span>
                            </span></li>
                        <li class="money"><em>￥23.80</em></li>
                        <li class="operate">
                            <a href="#">加入收藏夹</a>
                            <a href="#">删除</a>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="commodity">
                <div>
                    <ul>
                        <li class="checkbox"><label for=""><input type="checkbox"></label></li>
                        <li class="introduce">
                            <a href="#"><img src="http://127.0.0.1:3002/images/cart/1.jpg" alt=""></a>
                            <div>官方授权  《我的青春恋爱物语果然有问题》原版小说</div>
                            <div data-v-5abf99a0="" class="unit_price"><ruby data-v-5abf99a0="">
                                ￥23.80
                                <rp data-v-5abf99a0=""></rp> <rt data-v-5abf99a0="" class="logo" style="text-decoration: line-through; color: gray;">￥39.80</rt> <rp data-v-5abf99a0=""></rp></ruby></div>


                            <div class="amount">
                            <span class="goods_num">
                                <input data-v-376851e1="" type="text" value="0" class="num">
                                <span data-v-376851e1="" class="add">+</span>
                                <span data-v-376851e1="" class="reduce">-</span>
                            </span></div>
                        </li>
                        <li class="blank"></li>
                        <li class="temporary"></li>
                        <li class="unit_price">
                            <ruby>
                                ￥23.80
                                <rp></rp>
                                <rt class="logo" style="text-decoration:line-through;color: gray">￥39.80</rt>
                                <rp></rp>
                            </ruby>
                        </li>
                        <li class="amount">
                            <span class="goods_num">
                                <input data-v-376851e1="" type="text" value="0" class="num">
                                <span data-v-376851e1="" class="add">+</span>
                                <span data-v-376851e1="" class="reduce">-</span>
                            </span></li>
                        <li class="money"><em>￥23.80</em></li>
                        <li class="operate">
                            <a href="#">加入收藏夹</a>
                            <a href="#">删除</a>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="collect">
                <ul class="collect_l">
                    <li class="checkbox"><label for=""><input type="checkbox"></label><span>全选</span></li>
                </ul>
                <ul class="collect_r">
                    <li class="collect_sum">总金额:&nbsp;&nbsp;<i>2333.00</i></li>
                    <li class="collect_btn"><button>结算</button></li>
                </ul>
                <!--<button>结算</button>-->
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        name: "cart"
    }
</script>

<style scoped>
    @import '../../assets/css/cart.css';
</style>